<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>动态管理</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="format-detection" content="telephone=no">
    <link href="/node_modules/LobsterUIFrame/layuiadmin/layui/css/layui.css" rel="stylesheet" />
    <link href="/node_modules/LobsterUIFrame/layuiadmin/style/admin.css" rel="stylesheet" />
    <link href="/node_modules/LobsterUIFrame/layuiadmin/layui/css/modules/layui-icon-extend/iconfont.css"
        rel="stylesheet" />
    <script src="/node_modules/LobsterUIFrame/layuiadmin/layui/layui.js"></script>
</head>

<body>
    <div class="layui-fluid">
        <div class="layui-card layui-form">
            <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                <div class="layui-form-item" style="padding-left:15px;"> 
                    <div class="layui-inline" style="width:200px;">
                        <input type="text" class="layui-input" style="width:200px;" name="searchkey" autocomplete="off"
                            placeholder="用户，内容" />
                    </div>
                    <div class="layui-inline" style="width:120px;">
                        <button class="layui-btn layuiadmin-btn-useradmin" lay-submit lay-filter="LAY-list-submit"
                            id="btnSearch">
                            <i class="layui-icon layuiadmin-button-btn layui-icon-search"></i>查询
                        </button>
                    </div>
                </div>
            </div>
            <div class="layui-card-body">
                <table id="dataTable" lay-filter="dataTable"></table>
            </div>
        </div>
    </div>
</body>

<script type="text/html" id="edit">
    <a class="layui-btn layui-btn-sm" lay-event="detail" id="detail"><i class="layui-icon"></i>详情</a>
</script>

<script>
    layui.config({
        base: '/node_modules/LobsterUIFrame/layuiadmin/' //静态资源所在路径
    }).extend({
        index: 'lib/index' //主入口模块
    });

    layui.define(['index', 'layer', 'form', 'element', 'table', 'laydate'], function () {
        var layer = layui.layer;
        var form = layui.form;
        var element = layui.element;
        var table = layui.table;
        var $ = layui.$;
        var admin = layui.admin;
        var setter = layui.setter;
        var laydate = layui.laydate;

        var controller = {
            data: {
                sellistinfo: {},//选中列表行 
                table: null,
                tabledata: [],
                listmodel: {},//列表行模型  
                dynamictype: [{
                    Code: 1,
                    Name: '图文'
                }, {
                    Code: 2,
                    Name: '视频'
                }],
                limit: [
                    { Code: 1, Name: '全部' },
                    { Code: 2, Name: '仅自己' }]
            },
            //初始化页面
            initpage: function () {
                var self = this;
                self.tableLoad();
                self.initEvent();
            },
            getbaseurl: function (fun) {
                var url = "/lowcode/APP20211203093514696/name/?view=layui&fun=" + fun;
                return url;
            },
            //表数据加载
            tableLoad: function () {
                var self = this;
                var searchkey = $("[name='searchkey']").val();
                self.data.table = table.render({
                    elem: "#dataTable",
                    where: {
                        searchkey: searchkey,
                    },
                    url: self.getbaseurl("dynamic.getlist"),
                    height: "full-100",
                    toolbar: '#add',
                    size: '10',
                    page: true, //开启分页 
                    loading: true,
                    cols: [[
                        { field: 'Title', title: '标题', width: '10%' },
                        { field: 'NickName', title: '用户', width: '10%' },
                        { field: 'TopicName', title: '话题', width: '10%' },
                        {
                            field: 'TopicType', title: '动态类型', width: '8%', templet: function (d) {
                                var filter = self.data.dynamictype.filter(a => { return a.Code == d.DynamicType; });
                                if (filter != null && filter.length > 0)
                                    return filter[0].Name;
                                else
                                    return "";
                            }
                        },
                        {
                            field: 'Limit', title: '权限', width: '8%', templet: function (d) {
                                var filter = self.data.limit.filter(a => { return a.Code == d.Limit; });
                                if (filter != null && filter.length > 0)
                                    return filter[0].Name;
                                else
                                    return "";
                            }
                        },
                        { field: 'Location', title: '地点', width: '12%' },
                        { field: 'LikesCount', title: '点赞数', width: '8%' },
                        { field: 'EvaluateCount', title: '评论数', width: '8%' },
                        { field: 'CreateTime', title: '发布时间', width: '10%' },
                        { field: 'operation', title: '操作', toolbar: '#edit', fixed: 'right', width: '16%' }
                    ]]
                    , done: function (res) {

                    }
                });
            },
            //页面加载
            initEvent: function () {
                var self = this; 
                table.on('tool(dataTable)', function (obj) {
                    var data = obj.data;//当前行数据 
                    window.sellistinfo = data;
                    window.dynamictype = self.data.dynamictype;
                    window.limit=self.data.limit;
                    switch (obj.event) {
                        case 'detail':
                            self.openEdit(data.Title + '-详情');
                            break;
                    }
                }); 
                //查询列表
                form.on("submit(LAY-list-submit)", function (data) {
                    self.tableLoad();
                });
            },
            //打开编辑器
            openEdit: function (title) {
                var self = this;
                layer.open({
                    type: 2
                    , title: title
                    , content: "detail.html"
                    , area: ['50%', '100%']
                    // , btn: ['保存', '取消']
                    , resize: false
                    , success: function (layero, index) {

                    }
                    , btn2: function (index, layero) {

                    }
                    , cancel: function () {

                    }
                    , yes: function (index, layero) {
                        
                    }
                });
            },
            //获取应用字典
            GetDict: function (classId) {
                var self = this;
                return new Promise((resolve, reject) => {
                    admin.req({
                        url: self.getbaseurl("getdict"),
                        method: "get",
                        data: {
                            classId: classId
                        },
                        done: res => {
                            resolve(res);
                        }
                    });
                })
            }, 
        }

        /*
        * 入口
        */
        controller.initpage();
    });

</script>